<div ng-controller="SessionController"></div>
<form name="employee" class="">

	<div id="regDiv">
	
	<h1 class="header">New employee</h1>
	
	<div class="field">
		<label class="formLabel" for="employeeName">Employee name:</label>
		<div class="controls">
			<input id="employeeName" name = "name" type="text" placeholder="Employee name"
				ng-model="newEmployee.employee.name" required></input>
				<span class="required" ng-show="employee.name.$error.required">Required field.</span>
		</div>
	</div>
	<div class="field">
		<label class="formLabel" for="username">Username:</label>
		<div class="controls">
			<input id="username" name="username" type="text" placeholder="Username"
			 ng-minlength="5" ng-maxlength="20" ng-pattern="/^[A-z][A-z0-9]*$/"
				ng-model="newEmployee.employee.username" required>
				<span class="required" ng-show="employee.username.$error.required">Required field.</span>
   				<span class="required" ng-show="!employee.username.$error.minLength && !employee.username.$error.maxLength && employee.username.$error.pattern && employee.username.$dirty">Must start with a letter, and contain letters &amp; numbers only.</span>
   				<span class="required" ng-show="!employee.username.$error.required && (employee.username.$error.minlength || employee.username.$error.maxlength) && employee.username.$dirty">Username must be between 5 and 20 characters.</span>
			</input>
		</div>
	</div>
	<div class="field">
		<label class="formLabel" for="password">Password:</label>
		<div class="controls">
			<input id="password" name="password" type="password" placeholder="Password"
				ng-model="newEmployee.employee.password" ng-minlength="4" ng-maxlength="20" ng-pattern="/(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z])/" required></input>
				<span class="required" ng-show="employee.password.$error.required">Required field.</span>
   				<span class="required" ng-show="!employee.password.$error.required && (employee.password.$error.minlength || employee.password.$error.maxlength) && employee.password.$dirty">Passwords must be between 8 and 20 characters.</span>
  				<span class="required" ng-show="!employee.password.$error.required && !employee.password.$error.minlength && !employee.password.$error.maxlength && employee.password.$error.pattern && employee.password.$dirty">Must contain one lower &amp; uppercase letter, and one non-alpha character (a number or a symbol.)</span>
		</div>
	</div>
	<div class="field">
		<label class="formLabel" for="email" >Email:</label>
		<div class="controls">
			<input id="email" name="email" type="email" placeholder="Email"
				ng-model="newEmployee.employee.email" required></input>
				<span class="required" ng-show="employee.email.$error.required">Required field.</span>
		</div>
	</div>
	<div class="field">
		<label class="formLabel" for="company" required>Company:</label>
		<div class="controls">
			<select id="company" name="company" type="text" placeholder="Company"
				ng-model="newEmployee.employee.company.companyName" required>
				<option ng-repeat="company in companies">{{company.companyName}}</option>
				</select>
				<span class="required" ng-show="employee.company.$error.required">Required field.</span>
		</div>
	</div>
	<button class="myButton" type="submit" ng-click="createEmployee()" ng-disabled='!employee.$valid'>Create</button>
	
</div>
</form>
